<script setup>
import { QuillEditor } from '@vueup/vue-quill'
import '@vueup/vue-quill/dist/vue-quill.snow.css'
import { ref, watch } from 'vue'

const emits = defineEmits(['update:modelValue'])
const props = defineProps({
  modelValue: {
    type: String,
    default: ''
  }
})
const value = ref('')
const updateContent = (val) => {
  emits('update:modelValue', val)
}

watch(
  () => props.modelValue,
  (val) => {
    value.value = val
  },
  { immediate: true }
)
</script>

<template>
  <QuillEditor
    toolbar="full"
    contentType="html"
    @update:content="updateContent"
    v-model:content="value"
    theme="snow"
    placeholder="请输入"
  >
  </QuillEditor>
</template>
